<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ page contentType="text/html; charset=iso-8859-1" language="java"  errorPage="" %>
<html>
<head>
	<script src="<%=request.getContextPath() %>/js/jquery/jquery-1.4.2.min.js" language="javascript"></script>
	<script src="<%=request.getContextPath() %>/js/utiles.js" language="javascript"></script>
	<script src="<%=request.getContextPath() %>/js/util/utf8.js"  language="javascript"></script>
	<script src="<%=request.getContextPath() %>/js/util/util_popup.js" language="javascript"></script>
	<link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/css/estilos.css"/>
	<script type="text/javascript">
		/**
		 * Metodo que realiza la busqueda de los clientes.
		 */
		function f_buscar(){
			if(!validarFiltros()){
				alert("Debe ingresar al menos un filtro de busqueda.");
				return;
			}
			$('#tblSeleccionaTarjeta').css('display', 'none');
			$('#tblBotoneraDetalle').css('display', 'none');
			$('#btnBuscar').attr('disabled','disabled');
			var action = "<%=request.getContextPath()%>/bloqueo.do?method=buscarTarjetas";
			$.ajax(
				{
					type:'POST',
					url:action,
					data: $('#form1').serialize(),
					success: function(text){$('#tablaDetalle').html(text);}
				}
			);
			$('#btnBuscar').removeAttr('disabled');
		}
		
		/**
		 * Metodo que valida el ingreso de al menos un filtro de busqueda.
		 * @return confirmacion si se ingreso al menos un filtro.
		 */
		function validarFiltros(){
			var selTipoDocumento = obtenerParametro($('#selTipoDocumento').val());
			var txtNumDoc = obtenerParametro($('#txtNroDocumento').val());
			var txtNroTarjeta = obtenerParametro($('#txtNroTarjeta').val());
			var txtNombre = obtenerParametro($('#txtNombre').val());
			var txtApellidoPaterno = obtenerParametro($('#txtApellidoPaterno').val());
			var txtApellidoMaterno = obtenerParametro($('#txtApellidoMaterno').val());
			
			if(selTipoDocumento ==-1 && txtNumDoc == null 
				&& txtApellidoPaterno == null && txtApellidoMaterno == null
				&& txtNombre == null && txtNroTarjeta == null){
				return false;
			}
			return true;
		}
		
		/**
		 * Metodo que realiza la busqueda de una persona en Reniec.
		 * @param numeroDocumento numero del documento de identidad(DNI).
		 */
		function buscarReniec(){
			var numeroDocumento = $('#txtNroDocumentoident').val();			
			var params = "dialogHeight:600px;dialogWidth:600px;center:yes;help:no;resizable:si";
			var url    = "<%=request.getContextPath()%>/cliente.do?method=consultarReniec&numeroDocumento="+numeroDocumento;
			open_popup(url, params);
		}
		
		/**
		 * Metodo que retorna nulo si el parametro es nulo o contiene espacios en blanco.
		 * @param parametro contine la cadena aevaluarse.
		 * @return la cadena correcta despues de la evaluacion.
		 */
		function obtenerParametro(parametro){
			if(parametro == null || $.trim(parametro).length==0){
				return null;
			}
			return parametro;
		}
		
		function seleccionaTarjeta(indTarjeta, titular, producto, situacion, nrodocident){
			$('#tblSeleccionaTarjeta').css('display', 'block');
			$('#tblBotoneraDetalle').css('display', 'block');
			
			$('#txtTipoTarjeta').attr('value',producto);			
			$('#txtTitular').attr('value',titular);
			$('#txtSituacionTarjeta').attr('value',indTarjeta);
			$('#txtNroDocumentoident').attr('value',nrodocident);
		}
		
		function bloquearTarjeta(){
			
			var selTipoDocumento = obtenerParametro($('#selTipoDocumento').val());
			var txtNumDoc = obtenerParametro($('#txtNroDocumento').val());
			var txtNroTarjeta = obtenerParametro($('#txtNroTarjeta').val());
			var txtNombre = obtenerParametro($('#txtNombre').val());
			var txtApellidoPaterno = obtenerParametro($('#txtApellidoPaterno').val());
			var txtApellidoMaterno = obtenerParametro($('#txtApellidoMaterno').val());
			
		}
	</script>
</head>
<body>

<table class="tblTitulo"><tr><td>Bloqueo de Tarjetas</td></tr></table>
	<form name="form1" id="form1" method="post" action="<%=request.getContextPath()%>/confirmacioningreso.do?method=confirmarIngreso">
	<table width="100%" align="center" height="100%">
		<tr>
		<td valign="top">
			<div id="maestro2">
				<table align="center" cellspacing="3" class="table3" width="100%">
					<tr>
						<td colspan="6" class="cuadrotitle">I. Bloqueo de Tarjeta</td>
					</tr>
					<tr class="cuadrocontent">
						<td width="10%">&nbsp;</td>
						<td class="tcelda1" width="15%">Tipo de Documento:</td>
						<td width="20%"><select name="selTipoDocumento" id="selTipoDocumento" class="combo1" >
							<option value="-1">--Seleccionar--</option>
							<c:forEach items="${tiposDocumento}" var="docu">
								<option value="${docu.codigoparametro}">${docu.descripcion}</option>
							</c:forEach>
						</select></td>
						<td>&nbsp;</td>
						<td width="15%" class="tcelda1">Nombres:</td>
						<td width="20%"><input type="text" name="txtNombre" id="txtNombre" class="input" size="25" maxlength="50" /></td>
						<td width="10%">&nbsp;</td>
					</tr>
					<tr class="cuadrocontent">
						<td>&nbsp;</td>
						<td class="tcelda1">Nro. Documento:</td>
						<td><input type="text" name="txtNroDocumento" id="txtNroDocumento" class="input1" /></td>
						<td>&nbsp;</td>				
						
						<td class="tcelda1">Apellido Paterno:</td>
						<td><input type="text" name="txtApellidoPaterno" id="txtApellidoPaterno" class="input" /></td>
						<td>&nbsp;</td>
						
					</tr>
					<tr class="cuadrocontent">
						<td>&nbsp;</td>
						<td class="tcelda1">Nro. Tarjeta:</td>
						<td><input type="text" name="txtNroTarjeta" id="txtNroTarjeta" class="input1" /></td>
						<td>&nbsp;</td>
						
						<td class="tcelda1">Apellido Materno:</td>
						<td><input type="text" name="txtApellidoMaterno" id="txtApellidoMaterno" class="input" /></td>
						<td>&nbsp;</td>						
					</tr>
				</table>
			</div>
		
		</td>
	</tr>
	<tr>
						<td align="center">
							<div id="botonera">
								<input type="button" value="Buscar" id="btnBuscar" onClick="javascript:f_buscar();" class="boton"/>
							</div>
						</td>
					</tr>
	<tr>
		<td>
			<div id="detalle">
				<table width="100%">
					<thead>
					<tr>
						<td class="tceldatabla1" width="10%">Documento</td>
						<td class="tceldatabla1" width="13%">Nro. Documento</td>
						<td class="tceldatabla1" width="30%">Nombre/Raz&oacute;n Social</td>
						<td class="tceldatabla1" width="20%">Tarjeta</td>
						<!-- td class="tceldatabla1" width="7%">Estado</td-->
						<td class="tceldatabla1" width="10%">Producto</td>
						<td class="tceldatabla1" width="10%">SubProducto</td>
						<td class="tceldatabla1" width="5%">Sel</td>
						<!-- td class="tceldatabla1" width="7%">Divisa</td-->
					</tr>
					</thead>
					<tbody id="tablaDetalle" name="tablaDetalle">
					<tr>
						<td class="tceldatabla"> </td>
						<td class="tceldatabla"> </td>
						<td class="tceldatabla"> </td>
						<td class="tceldatabla">&nbsp;</td>
						<td class="tceldatabla"> </td>
						<td class="tceldatabla"> </td>
						<td class="tceldatabla"> </td>
					</tr>
					</tbody>
				</table>
			</div>
	  </td>
	</tr>
	</table>
	<table align="center" border="1" id="tblTarjetaSeleccionada">
	<tr style="display: none;" id="tblSeleccionaTarjeta">
		<td valign="top" align="center">
			<div id="maestro2">
				<table align="center" cellspacing="3" class="table3" width="100%">
					<tr class="cuadrocontent">
						<td width="3%">&nbsp;</td>
						<td class="tcelda1" width="15%">Tipo Tarjeta</td>
						<td width="35%"><input type="text" name="txtTipoTarjeta" id="txtTipoTarjeta" class="input1" disabled="disabled"/></td>
						<td class="tcelda1" width="20%">Situaci&oacute;n de Tarjeta</td>
						<td width="20%"><input type="text" name="txtSituacionTarjeta" id="txtSituacionTarjeta" class="input1" disabled="disabled" /></td>
						<td width="5%">&nbsp;</td>
						<input type="hidden" id="txtNroDocumentoident" name="txtNroDocumentoident"/>
					</tr>
					<tr class="cuadrocontent">
						<td>&nbsp;</td>
						<td class="tcelda1">Titular</td>
						<td><input type="text" name="txtTitular" id="txtTitular" class="input" disabled="disabled" size="35"/></td>
						<td class="tcelda1">Solicita Reposici&oacute;n</td>
						<td><input type="checkbox" name="chkSolicitaReposicion" id="chkSolicitaReposicion" /></td>
						<td>&nbsp;</td>
					</tr>
					<tr class="cuadrocontent">
						<td>&nbsp;</td>
						<td class="tcelda1">Acci&oacute;n</td>
						<td><select name="selAccion" id="selAccion" class="combo1" >
							<option value="-1">--Seleccionar--</option>
							<option value="cancela">CANCELAR</option>
							<option value="bloqueo">BLOQUEO</option>
						</select></td>
						<td class="tcelda1">Motivo</td>
						<td><select name="selMotivo" id="selMotivo" class="combo1" >
						<option value="-1">--Seleccionar--</option>
						<c:forEach items="${cache.motivoscancelacion}" var="motivocancel">
							<option value="${motivocancel.codigoparametro}">${motivocancel.descripcion}</option>
						</c:forEach>						
						</select></td>
						<td>&nbsp;</td>
					</tr>
					<tr class="cuadrocontent">
						<td>&nbsp;</td>
						<td class="tcelda1">Oficina de Envio</td>
						<td><input type="checkbox" name="chkOficinaEnvio" id="chkOficinaEnvio" /></td>
						<td class="tcelda1">Oficina de Envio</td>
						<td><input type="text" name="txtOficinaEnvio" id="txtOficinaEnvio" class="input1" disabled="disabled"/></td>
						<td>&nbsp;</td>
					</tr>
					<tr class="cuadrocontent">
						<td>&nbsp;</td>
						<td class="tcelda1">Qui&eacute;n Reporta</td>
						<td><input type="text" name="txtQuienReporta" id="txtQuienReporta" class="input" /></td>
						<td>&nbsp;</td>
					</tr>
					<tr class="cuadrocontent">
						<td>&nbsp;</td>
						<td class="tcelda1">Descripci&oacute;n</td>
						<td><input type="text" name="txtDescripcion" id="txtDescripcion" class="input" /></td>
						<td>&nbsp;</td>
					</tr>
					<tr class="cuadrocontent">
						<td>&nbsp;</td>
						<td class="tcelda1">Nro. Bloqueo</td>
						<td><input type="text" name="txtNroBloqueo" id="txtNroBloqueo" class="input" /></td>
						<td class="tcelda1">Clave de Notificaci&oacute;n</td>
						<td><input type="text" name="txtClaveNotificacion" id="txtClaveNotificacion" class="input1" disabled="disabled"/></td>
						<td>&nbsp;</td>
					</tr>
				</table>
			</div>
		
		</td>
	</tr>
	<tr style="display: none" id="tblBotoneraDetalle">
		<td align="center" valign="top">
			<div id="botonera">
				<input type="button" value="Guardar" onClick="javascript:bloquearTarjeta();" class="boton"/>
				<input type="button" value="Reimp. Voucher" onClick="#" class="boton1"/>
				<input type="button" value="Reniec" onClick="javascript:buscarReniec();" class="boton"/>
			</div>
		</td>
	</tr>	
</table>
</form>
</body>
</html>